<template>

  <el-container style="height: 870px;width: 100%">
    <el-header style="height: 10%;background-color: rgb(72,209,204);">
      <div style="background-color: rgb(72,209,204);width: 33%;height: 100%;float: left"></div>
      <div style="background-color: rgb(72,209,204);width: 34%;height: 100%;float: left"> <p style="color: #91959c;font-size: 23px;line-height: 23px;font-weight: bold;height: 40px">联盟招标情况</p></div>
      <div style="background-color: rgb(72,209,204);width: 33%;height: 100%;float: left" >  <el-button type="danger" plain  @click="jump('Index')">返回主页</el-button></div>
    </el-header>
    <el-container style="height: 100%">
      <el-main style="padding: 0px">








        <template>


          <div>

            <div style="height: 100px;margin-top: 0px ">
              <div style="float: left;width: 70%;height: 100%">
                <p style="color: black;font-size: 23px;line-height: 23px;font-weight: bold;height: 40px;margin-left: 40%">--  组队工作室管理  --</p>
              </div>
              <div style="float: left;width: 30%;height: 100%">
                <el-button  type="success" style="margin-bottom: 20px" round @click="jump()">添加工作室需求</el-button>
              </div>
            </div>

            <div >
              <div v-for="table in teamData" style="float: left;margin-left: 85px;height: 500px;width: 360px ;background-color: white;margin-top: 50px;box-shadow: 0 8px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04)" >
                <div v-if="table.puanduan===0">
                  <div  style="width: 300px;height: 200px;margin-top: 40px">
                    <img :src="table.photo" style="width: 250px;height: 200px;margin-left: 40px">
                  </div>
                  <div style="height: 30px;width: 370px;line-height: 0px">
                    <div  class="text-wrapper" style="height: 30px;width: 360px">
                      <p style="line-height: 30px">招标中</p>
                    </div>
                  </div>
                  <div class="text-wrapper" style="width: 340px;height:120px;white-space: pre-wrap;margin-top: 30px;margin-left: 10px" >
                    <div style="height: 30px;line-height: 0px ">
                      <p style="width: 340px;word-wrap: break-word;height: 80px;line-height: 30px ;margin-top: 30px;overflow: auto">项目要求： {{table.demand}}  <a :href=table.doc >点我下载详细信息</a></p>
                      <el-row style="margin-left: 0px">
                        <el-button type="primary" size="small " round  @click="jumppp(table.id)">查看</el-button>
                      </el-row>
                    </div>
                  </div>
                </div>
                <div v-if="table.puanduan===1">


                  <div  style="width: 300px;height: 200px;margin-top: 40px">
                    <img :src="table.photo" style="width: 250px;height: 200px;margin-left: 40px">
                  </div>
                  <div style="height: 60px;width: 370px;line-height: 0px">
                    <div  class="text-wrapper" style="height: 60px;width: 360px">
                      <p style="line-height: 10px">招标结束</p>
                      <p style="line-height: 30px">中标工作室名：{{table.workroomName}}</p>
                      <p style="line-height: 10px">报价：{{table.price}}</p>
                    </div>
                  </div>
                  <div class="text-wrapper" style="width: 340px;height:120px;white-space: pre-wrap;margin-top: 30px;margin-left: 10px" >
                    <div style="height: 30px;line-height: 0px ">
                      <p style="width: 340px;word-wrap: break-word;height: 120px;line-height: 30px ;margin-top: 30px;overflow: auto">项目要求： {{table.demand}}  <a :href=table.doc >点我下载详细信息</a></p>
                      <!--<el-row style="margin-left: 0px">-->
                        <!--&lt;!&ndash;<el-button type="primary" size="small " round  @click="jumppp(table.id)">工作室管理</el-button>&ndash;&gt;-->
                      <!--</el-row>-->
                    </div>
                  </div>

                </div>
              </div>
            </div>
          </div>


        </template>





      </el-main>
    </el-container>
  </el-container>
</template>
<style >
  .el-menu-vertical-demo:not(.el-menu--collapse) {
    width: 200px;
    min-height: 400px;
  }

  .el-header, .el-footer {
    color: #7c235b;
    text-align: center;
    line-height: 60px;
  }

  .el-aside {
    background-color: #c0c3bf;
    color: #333;
    line-height: 200px;
    font-size: 25px;
    font-weight: bold;
    text-align: left;
  }

  .el-main {
    background-color: #e0e4eb;
    color: #333;
    text-align: center;
    line-height: 60px;
  }

  body > .el-container {
    margin-bottom: 40px;
  }
  . hh{
    height: 56px;
    line-height: 56px;
    position: relative;
    -webkit-box-sizing: border-box;
    white-space: nowrap;
  }
  .el-container:nth-child(5) .el-aside,
  .el-container:nth-child(6) .el-aside {
    line-height: 260px;
  }
  .el-menu-item, .el-submenu__title {
    height: 56px;
    line-height: 56px;
    position: relative;
    -webkit-box-sizing: border-box;
    white-space: nowrap;
    padding-left: 100px;
    /*list-style-position: initial;*/
    list-style-type: initial ;
  }
  .el-container:nth-child(7) .el-aside {
    line-height: 320px;
  }
</style>
<script>
  export default {
    data() {
      return {
        teamData:[
          {
            id:'',
            price:'',
            demand:'',
            doc:'',
            photo:'',
            workroomName:'',
            puanduan:'',
          }
        ]
      }
    },
    mounted: function(){

      this.tid = this.$route.query.mallCode  //输入内容
      var user= JSON.parse(window.sessionStorage.getItem("user"));
      var ff=user.id
      axios.post('/user/selectTeamDemand',{
        tid:this.tid,
        wid:this.tid
      }).then((response) => {
        if( response.data != null){
          ///workroom/insertTeamDemand
          var e=response.data


          console.log(eee)
          var data=[];

          for(var c=0;c<e.length;c++){
            var ee=e[c]
            var eee=ee.teamDemand
            var eeee=ee.workRoom

            var obj={}

            obj.id=eee.id
            obj.price=eee.price
            obj.demand=eee.demand
            obj.doc=eee.doc

            if(eee.wid!=0){
              obj.photo=eeee.photoUrl
              obj.workroomName=eeee.workroomName
              obj.puanduan=1
            }else{
              obj.photo=eee.photo
              obj.puanduan=0
            }
            data[c]=obj
            console.log(obj)}

          this.teamData=data

        }
        else{
          // this.$notify({
          //   title: '失败',
          //   message: '错误',
          //   type: 'warning',
          //   duration:2000
          // });
        }
      })

    },
    methods: {


      jumppp(path) {
        console.log(path)
        this.$router.push({
          path: '/ChildProject',
          query: {
            mallCode: path,
          }
        })


      },

      jump(path) {
        console.log(path)
        this.$router.push({
          path: '/TeamMemberDemand',
          query: {
            mallCode: this.tid,
          }
        })


      },


    }}
</script>
